<template>
  <div class="news-list">
    <!-- <li>标题:{{ query.title }}</li>
    <li>内容:{{ query.content }}</li> -->

    <!-- <li>标题:{{ params.title }}</li>
    <li>内容:{{ params.content }}</li> -->

    <li>标题:{{ title }}</li>
    <li>内容:{{ content }}</li>
  </div>
</template>

<script setup lang="ts" name="">
// import { reactive, ref, toRefs } from "vue"
// import { useRoute } from "vue-router"
// const route = useRoute()

// 从响应式对象身上直接结构，会丢失响应式，需要用toRefs
// let { query, params } = toRefs(route)

// 配置了路由props后可以这么用
const props = defineProps(['title', 'content'])
console.log(props.title);

</script>

<style scoped></style>